<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    
    <script>
        let arr = [1,2,3];
        // 以前我们想获取其中的值，只能通过角标。ES6 可以这样：
        const [x,y,z] = arr;// x，y，z 将与 arr 中的每个位置对应来取值
        // 然后打印
        console.log(x,y,z);

        const person = {
                name: "jack",
                age: 21,
                language: ['java', 'js', 'css']
            }
        
        // 解构表达式获取值，将 person 里面每一个属性和左边对应赋值
        const { name, age, language } = person;

        // 等价于下面
        // const name = person.name;
        // const age = person.age;
        // const language = person.language;
        // 可以分别打印
        console.log(name);
        console.log(age);
        console.log(language);
        
        //扩展：如果想要将 name 的值赋值给其他变量，可以如下,nn 是新的变量名
        const { name: nn, age, language } = person;
        console.log(nn);
        console.log(age);
        console.log(language);
        
        let str = "hello.vue";
        // 返回布尔值，表示参数字符串是否在原字符串的头部
        console.log(str.startsWith("hello"));//true
        // 返回布尔值，表示参数字符串是否在原字符串的尾部
        console.log(str.endsWith(".vue"));//true
        // 返回布尔值，表示是否找到了参数字符串
        console.log(str.includes("e"));//true
        console.log(str.includes("hello"));//true
        
        // 模板字符串相当于加强版的字符串，用反引号 `,除了作为普通字符串，还可以用来定义多行字符串，还可以在字符串中加入变量和表达式。
        let ss = `
                    <div>
                        <span>hello world<span>
                    </div>
                `
        console.log(ss)

        // 2、字符串插入变量和表达式。变量名写在 ${} 中，${} 中可以放入 JavaScript 表达式。
        let name = "张三";
        let age = 18;
        let info = `我是${name}，今年${age}了`;
        console.log(info)

        // 3、字符串中调用函数
        function fun() {
            return "这是一个函数"
        }
        let sss = `O(∩_∩)O 哈哈~，${fun()}`;
        console.log(sss); // O(∩_∩)O 哈哈~，这是一个函数

        
    </script>

</body>
</html>